//渲染列表
function render(data) {
    var str = ''
    str = data.map((item, index) => {
        return ` <ul class="row">
        <li>  <input type='checkbox' class='check'></li>
          <li>${item.one}</li> 
          <li>${item.dong}</li>
          <li>${item.shi}</li>
          <li>${item.pai}</li>
          <li>正常</li>
          <li>${item.math}</li>
          <li>
              <span  id="101">操作</span>
              <span  id="101">删除</span>
          </li>
      </ul>`
    }).join('')
    if (str == '') {
        str = '<ul style="text-align:center;color:red">未查询到数据!</ul>'
    }
    document.querySelector(' .three').innerHTML = str;
}


axios.get('/user/list', { params: { page:1,count:4 } ,headers:{} } ).then((res)=>{
    //调用render方法, 传入后端返回的数据 渲染列表
    render( res.data.list );
    console.log(res.data);
})

//分页
var page=1
var prev = document.querySelector(".prev")
var next = document.querySelector('.next')
shang.onclick = function () {
    if(page<=4){
        prev.disabled=true
    }
    if (page > 1) {
        axios.get('/user/list', { params: { page:--page,count:4}  } ).then((res)=>{
            //调用render方法, 传入后端返回的数据 渲染列表
            render( res.data.list );
            console.log(res.data);
        })
        next.disabled=false
    }
    }

    next.onclick = function () {
        if(page>=4){
            shang.disabled=true
        }
        if (page <6) {
            axios.get('/user/list', { params: { page:++page,count:4}  } ).then((res)=>{
                //调用render方法, 传入后端返回的数据 渲染列表
                render( res.data.list );
                console.log(res.data);
            })
            next.disabled=false
        }
        }




